@charset "utf-8";
/* CSS Document */

  

/**********************************************************/
/* SP */
/**********************************************************/
@media screen and (max-width:767px){
  
  
/**********************************
全体
**********************************/
body {
  min-width: 100%;
  -webkit-text-size-adjust: 100%;/*スマホを横向きにしたときに文字サイズを自動調整する機能を制御*/
  font-size: 1.4rem;
}
.pc{
  display: none;
}
.sp{
  display: block;
}
.inner,
.inner2,
.inner3  {
  max-width: 100%;
  margin: 0 auto;
}
.inner04 {
  width: calc(335 / 375 * 100%);
}
.inner05 {
  width: calc(355 / 375 * 100%);
}
.sec-ttl {
  font-size: 3.6rem;
}  
.sec-sbttl {
  font-size: 1.4rem;
  top: 22px;
}  
.ttl-box p {
  font-size: 0.8rem;
  margin-top: 5px;
}
button {
  width: auto;
  padding:0;
  margin:0;
  background:none;
  border:0;
  font-size:0;
  line-height:0;
  overflow:visible;
  cursor:point
}
  
  
  
/**********************************
header
**********************************/
h1 {
  min-width: auto;
  width: 60px;
  top: 20px;
  left: 20px;
}
header::before {
  width: 23px;
}
header::after {
  height: 91px;
}
header nav {
  top: 28px;
  right: 10px;
}
header nav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  max-width: 250px;
}
header nav ul li{
  margin-left: 3px;
}
header nav a {
  font-size: 0.9rem;
  width: 78px;
  height: 22px;
  padding-top: 7px;
}
  
/**********************************
header（下層共通）
**********************************/
.under-header {
  background-image: url(../images/common/under-pages_sp.png);
  background-size: 188px;
  height: 138px;
}
  
/**********************************
ハンバーガー
**********************************/
.openbtn {
  bottom: 40px;
  right: 10px;
  width: 68px;
  height: 68px;
}
.btnripple2::after,
.btnripple2::before {
  left: -7%;
  top: -8%;
  width: 110%;
  height: 110%;
}
.openbtn span:nth-of-type(2) {
  top: 26px;
  font-size: 1.5rem;
}
.openbtn span:nth-of-type(4) {
  width: 62px;
  height: 62px;
}  
  
/**********************************
　ハンバーガー内メニュー
**********************************/
#g-nav.panelactive #g-nav-list {
  width: 100%;
}
#g-nav-list .nav-border {
  height: 519px;
  left: 10px;
  transform: translate(0,-50%);
}
#g-nav-list img.nav-img {
  left: 40px;
  transform: translate(0,-50%);
  width: 55px;
}
#under-nav-list {
  bottom: 37px;
  right: 10px;
  transform: translateY(0);
}
#g-nav .page-link {
  width: 53%;
  left: 85%;
  transform: translate(-85%,-50%);
}
#g-nav #under-nav-list li a {
  padding: 5px 10px;
}
#g-nav #under-nav-list li a::before {
  top: 11px;
  left: -27px;
}
  
/**********************************
　ファーストビュー
**********************************/
.fv {
  position: relative;
  top: 0;
  width: 100vw;
  height: 100vh;
  min-height: auto;
}
.fv h2 {
  bottom: 57px;
  left: 6%;
  font-size: 2.4rem;
}  
.fv p {
  font-size: 1.4rem;
  bottom: 36vh;
  right: 0;
}
.fv .container {
  top: -188px;
  bottom: auto;
  right: 4%;
  height: 90vh;
  width: 65%;
}
video {
  width: 190%;
  margin-left: -28%;
}
.fv .container2 {
  display: none;
}  
.fv .container3 {
  bottom: 14%;
  right: 46%;
  height: 64vh;
  width: 32%;
}
.fv .container4 {
  position: absolute;
  top: 7%;
  bottom: auto;
  right: 79%;
  height: 100vh;
  width: 30px;
}
.fv .border1 {
  bottom: 41vh;
  left: 36%;
  height: 20vh;
}
.fv .border2 {
  bottom: 26vh;
  left: 20px;
  height: 40vh;
}  
  
  
/**********************************
section共通
**********************************/
.top-ttl{
  min-width: 80%;
  width: calc(100% - 40px);
  height: 120px;
}

.top-ttl h2 {
  left: 10px;
  font-size: 2.6rem;
  height: 199px;
  padding: 0;
  top: 40px;
  letter-spacing: 0.02em;
}  
.top-ttl h2::after {
  top: -22px;
}  

.more-btn a {
  font-size: 1.8rem;
  width: 115px;
}
.more-btn a::before {
  width: 107px;
  left: 8%;
  }


/**********************************
footer
**********************************/
footer {
  position: relative;
  height: 430px;
}
footer::after {
  right: 0;
  width: 100%;
  height: 409px;
  clip-path: polygon(0 10%, 100% 0, 100% 100%, 0% 100%);
}
footer div.flex {
  padding-top: 60px;
  align-items: flex-start;
  padding-bottom: 64px;
}
footer nav.flex {
  width: 50%;
  display: block;
  margin-right: 0px;
  padding-right: 10px;
  letter-spacing: 0.07em;
}
.f-logo{
  width: 50%;
  padding:10px 0 0 40px;
}
.f-logo img{
  margin-left: 0;
  width: 43px;
}
.copyright {
  font-size: 0.9rem;
  padding-top: 5px;
}

.br_nonePc {
  display: block;
}

}
